<?php
/* ============================================================
   indexrosenthal.php
   Explorador de documentos — CEP. Salesiano Rosenthal de la Puente
   Publicado en: https://salesianos.online/documentos/
   Embebido vía iframe en: https://salesianorosenthal.edu.pe/documentos/
   ============================================================ */

$dir      = isset($_GET['dir']) ? $_GET['dir'] : '.';
$excluded = [
    'error_log', '.htaccess', '.well-known', 'cgi-bin',
    'subida', 'images', 'PORTADAS', '.user.ini', 'php.ini'
];

$files = array_diff(scandir($dir), ['.', '..']);

$folders   = [];
$documents = [];

foreach ($files as $file) {
    if (in_array($file, $excluded)) continue;
    /* Ocultar archivos que empiecen con "index" */
    if (stripos($file, 'index') === 0) continue;
    /* Ocultar archivo específico */
    if ($file === 'ULTIMO_BOLETIN.html') continue;

    $filePath = $dir . DIRECTORY_SEPARATOR . $file;
    if (is_dir($filePath)) {
        $folders[] = $file;
    } else {
        $documents[] = $file;
    }
}

/* ── Ordenamiento personalizado de carpetas ── */
function customFolderSort($a, $b) {
    preg_match('/^(\d+)/', $a, $ma);
    preg_match('/^(\d+)/', $b, $mb);
    $lenA = isset($ma[1]) ? strlen($ma[1]) : 0;
    $lenB = isset($mb[1]) ? strlen($mb[1]) : 0;
    if ($lenA > 0 && $lenB > 0) {
        if ($lenA === 3 && $lenB === 3) return strnatcasecmp($a, $b);
        if ($lenA >= 4 && $lenB >= 4)  return strnatcasecmp($b, $a);
        if ($lenA === 3 && $lenB >= 4)  return -1;
        if ($lenA >= 4 && $lenB === 3)  return  1;
        return strnatcasecmp($a, $b);
    }
    if ($lenA > 0 && $lenB === 0) return -1;
    if ($lenA === 0 && $lenB > 0) return  1;
    return strnatcasecmp($a, $b);
}
/* ── Carpetas con orden descendente de archivos ── */
$descendingFolders = ['El Pan del Alma', 'Boletín Salesiano'];

/*
 * Detectar carpeta actual tanto por ?dir= como por URL directa,
 * igual que se hace para $trimOffset más abajo.
 */
$currentFolderName = basename($dir);

if ($currentFolderName === '.' || $currentFolderName === '') {
    /* Acceso por URL directa: el script está físicamente dentro de la carpeta */
    $physFolderDesc = basename(__DIR__);
    if (!in_array($physFolderDesc, $descendingFolders)) {
        $physFolderDesc = basename(getcwd());
    }
    if (in_array($physFolderDesc, $descendingFolders)) {
        $currentFolderName = $physFolderDesc;
    }
}

/* Limpiar prefijo './' que a veces trae $dir */
if ($currentFolderName === '.') {
    $cleanDirDesc = ltrim(rtrim($dir, '/'), './');
    if ($cleanDirDesc !== '') {
        $currentFolderName = basename($cleanDirDesc);
    }
}

$isDescending = in_array($currentFolderName, $descendingFolders);

usort($folders, 'customFolderSort');

if ($isDescending) {
    $folders = array_reverse($folders);
    rsort($documents, SORT_NATURAL | SORT_FLAG_CASE);
} else {
    sort($documents, SORT_NATURAL | SORT_FLAG_CASE);
}

/* ── Icono por extensión ── */
function getFileIcon($ext) {
    $map = [
        'pdf'  => '📄', 'doc'  => '📝', 'docx' => '📝', 'txt'  => '📋',
        'xls'  => '📊', 'xlsx' => '📊', 'csv'  => '📊',
        'ppt'  => '📽️', 'pptx' => '📽️',
        'jpg'  => '🖼️', 'jpeg' => '🖼️', 'png'  => '🖼️', 'gif'  => '🖼️',
        'zip'  => '🗜️', 'rar'  => '🗜️',
        'mp3'  => '🎵', 'wav'  => '🎵',
        'mp4'  => '🎥', 'avi'  => '🎥', 'mov'  => '🎥',
        'php'  => '💻', 'html' => '💻', 'css'  => '🎨', 'js'   => '🖥️'
    ];
    return $map[$ext] ?? '📎';
}

/* ── Tamaño legible ── */
function humanSize($bytes) {
    if ($bytes >= 1048576) return number_format($bytes / 1048576, 2) . ' MB';
    if ($bytes >= 1024)    return number_format($bytes / 1024,    1) . ' KB';
    return $bytes . ' B';
}

$totalItems = count($folders) + count($documents);
?>
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Documentos — Salesiano Rosenthal de la Puente</title>

  <!--
    Tipografías de marca — CEP. Salesiano Rosenthal de la Puente:
    - Principal UI:  Montserrat (sans-serif, moderna, institucional)
    - Cuerpo/tabla:  Open Sans (legibilidad óptima en pantalla)
  -->
  <link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,700&family=Open+Sans:wght@400;600;700&display=swap" rel="stylesheet">

  <style>
    /* ══════════════════════════════════════════
       COLORES INSTITUCIONALES
       CEP. Salesiano Rosenthal de la Puente
    ══════════════════════════════════════════ */
    :root {
      /* Azules corporativos */
      --azul-principal: #0038A6;   /* Azul institucional primario          */
      --azul-medio:     #1E5CC4;   /* Azul medio — hover y acentos         */
      --azul-claro:     #3FA0FF;   /* Azul claro — énfasis secundario      */
      --azul-oscuro:    #061F4D;   /* Azul oscuro — fondos oscuros         */
      /* Dorado corporativo */
      --dorado:         #F2C94C;   /* Dorado institucional principal        */
      --dorado-glow:    #FFD966;   /* Dorado luminoso — resaltes           */
      /* Complementarios */
      --rojo:           #D32F2F;   /* Rojo — alertas y volver              */
      --celeste:        #5DADE2;   /* Celeste — acento auxiliar            */
      /* Neutros */
      --blanco:         #FFFFFF;
      --gris-fondo:     #F5F7FF;
      --gris-borde:     #C8D5F0;
      --negro:          #1A1A1A;
    }

    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    html { height: auto !important; }
    body {
      font-family: 'Open Sans', sans-serif;
      background: #ffffff;
      color: var(--negro);
      padding: 16px 14px 36px;
      min-width: 0;
      height: auto !important;
      min-height: 0 !important;
    }

    /* ══════════════════════════════════════════
       CABECERA — degradado azul oscuro → azul principal
    ══════════════════════════════════════════ */
    .srdlp-header {
      background: linear-gradient(135deg,
        var(--azul-oscuro)    0%,
        var(--azul-principal) 55%,
        var(--azul-medio)     100%);
      border-radius: 10px 10px 0 0;
      padding: 24px 28px 20px;
      position: relative;
      overflow: hidden;
    }

    /* Elemento decorativo: resplandor azul */
    .srdlp-header::before {
      content: '';
      position: absolute;
      top: -60px; right: -60px;
      width: 260px; height: 260px;
      background: radial-gradient(circle,
        rgba(63,160,255,.18) 0%,
        rgba(242,201,76,.07) 50%,
        transparent 70%);
      border-radius: 50%;
    }
    /* Franja dorada inferior — sello de marca Rosenthal */
    .srdlp-header::after {
      content: '';
      position: absolute;
      bottom: 0; left: 0; right: 0;
      height: 4px;
      background: linear-gradient(90deg,
        var(--dorado),
        var(--dorado-glow),
        var(--dorado));
    }

    .srdlp-inst {
      font-family: 'Montserrat', sans-serif;
      font-weight: 900;
      font-size: clamp(13px, 3vw, 20px);
      color: var(--blanco);
      text-transform: uppercase;
      letter-spacing: .5px;
      line-height: 1.2;
      margin-bottom: 5px;
    }
    .srdlp-sub {
      font-family: 'Montserrat', sans-serif;
      font-style: italic;
      font-weight: 400;
      font-size: clamp(11px, 1.8vw, 13px);
      color: var(--dorado);
      margin-bottom: 0;
    }

    /* ── Barra de título (dorado corporativo) ── */
    .srdlp-titlebar {
      background: var(--dorado);
      padding: 11px 22px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 6px;
      border-left: 5px solid var(--azul-principal);
    }
    .srdlp-titlebar h2 {
      font-family: 'Montserrat', sans-serif;
      font-weight: 800;
      font-size: clamp(12px, 2.4vw, 16px);
      color: var(--azul-oscuro);
      text-transform: uppercase;
      letter-spacing: .5px;
    }
    /* ── Breadcrumb navigation ── */
    .srdlp-breadcrumb {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 2px;
      font-family: 'Montserrat', sans-serif;
      font-size: 11px;
      font-weight: 600;
      color: var(--azul-oscuro);
      opacity: .85;
      min-width: 0;
    }
    .srdlp-breadcrumb a {
      color: var(--azul-oscuro);
      text-decoration: none;
      white-space: nowrap;
      padding: 2px 5px;
      border-radius: 4px;
      transition: background .15s, color .15s;
    }
    .srdlp-breadcrumb a:hover {
      background: var(--azul-principal);
      color: var(--blanco);
      opacity: 1;
    }
    .srdlp-breadcrumb .bc-sep {
      color: var(--azul-principal);
      font-size: 12px;
      line-height: 1;
      padding: 0 1px;
      user-select: none;
    }
    .srdlp-breadcrumb .bc-current {
      color: var(--azul-oscuro);
      font-weight: 800;
      white-space: nowrap;
      padding: 2px 5px;
    }

    /* ── Contenedor principal ── */
    .srdlp-wrap {
      background: var(--blanco);
      border-radius: 0 0 10px 10px;
      box-shadow: 0 4px 22px rgba(6,31,77,.13);
      overflow: hidden;
    }

    /* ══════════════════════════════════════════
       TABLA
    ══════════════════════════════════════════ */
    .srdlp-table {
      width: 100%;
      border-collapse: collapse;
      font-size: clamp(12px, 1.8vw, 14px);
      font-family: 'Open Sans', sans-serif;
    }

    /* Encabezado: azul oscuro corporativo con texto dorado */
    .srdlp-table thead tr {
      background: var(--azul-oscuro);
      color: var(--dorado);
    }
    .srdlp-table thead th {
      font-family: 'Montserrat', sans-serif;
      font-weight: 700;
      font-size: 10.5px;
      text-transform: uppercase;
      letter-spacing: 1px;
      padding: 12px 16px;
      text-align: left;
      white-space: nowrap;
    }

    /* Filas alternas: blanco / azul muy tenue */
    .srdlp-table tbody tr:nth-child(odd)  { background: #f7f9ff; }
    .srdlp-table tbody tr:nth-child(even) { background: #edf2ff; }
    .srdlp-table tbody tr { transition: background .15s; }
    .srdlp-table tbody tr:hover { background: #d8e6ff; }

    .srdlp-table td {
      padding: 10px 16px;
      border-bottom: 1px solid var(--gris-borde);
      vertical-align: middle;
      line-height: 1.5;
    }

    /* Nombre del archivo/carpeta */
    .td-name a {
      font-family: 'Montserrat', sans-serif;
      font-weight: 600;
      color: var(--azul-principal);
      text-decoration: none;
      display: flex;
      align-items: center;
      gap: 8px;
      word-break: break-word;
    }
    .td-name a:hover           { color: var(--azul-claro); text-decoration: underline; }
    .td-name a.folder-link     { color: var(--azul-oscuro); font-weight: 700; }
    .td-name a.back-link       { color: var(--rojo); font-weight: 700; }

    /* Badges */
    .td-type { white-space: nowrap; }
    .badge-type {
      display: inline-block;
      background: var(--azul-principal);
      color: var(--blanco);
      font-family: 'Montserrat', sans-serif;
      font-weight: 700;
      font-size: 10px;
      letter-spacing: .6px;
      padding: 2px 9px;
      border-radius: 20px;
      white-space: nowrap;
    }
    .badge-folder { background: var(--azul-oscuro); }
    .badge-back   { background: var(--rojo); }

    /* Tamaño */
    .td-size {
      white-space: nowrap;
      font-family: 'Montserrat', sans-serif;
      font-size: 12px;
      color: #5a6a8a;
      font-weight: 600;
      text-align: right;
    }

    .file-icon { font-size: 16px; flex-shrink: 0; line-height: 1; }

    /* Footer de tabla */
    .srdlp-table tfoot td {
      background: var(--azul-oscuro);
      color: rgba(255,255,255,.75);
      font-family: 'Montserrat', sans-serif;
      font-size: 12px;
      font-weight: 600;
      padding: 10px 16px;
      border: none;
    }
    .srdlp-table tfoot td strong { color: var(--dorado); }

    /* ══════════════════════════════════════════
       RESPONSIVE MÓVIL ≤ 560px
       Filas transpuestas como tarjetas apiladas
    ══════════════════════════════════════════ */
    @media (max-width: 560px) {
      body { padding: 10px 8px 28px; }
      .srdlp-header  { padding: 18px 14px 16px; }
      .srdlp-titlebar { padding: 10px 14px; }

      .srdlp-table thead { display: none; }

      .srdlp-table tbody tr {
        display: block;
        border: 1px solid var(--gris-borde);
        border-radius: 8px;
        margin: 7px 6px;
        overflow: hidden;
        background: #f7f9ff !important;
        box-shadow: 0 2px 8px rgba(6,31,77,.08);
      }
      .srdlp-table tbody tr:nth-child(even) { background: #edf2ff !important; }

      .srdlp-table td {
        display: block;
        padding: 8px 12px;
        border-bottom: 1px dashed var(--gris-borde);
        font-size: 13px;
      }
      .srdlp-table td:last-child { border-bottom: none; }

      /* Primera celda: fondo azul como encabezado de tarjeta */
      .td-name {
        background: var(--azul-principal) !important;
      }
      .td-name a,
      .td-name a.folder-link { color: var(--blanco) !important; }
      .td-name a.folder-link  { background: none; }
      .td-name a.back-link    { color: #ffaaaa !important; }
      .td-name a:hover        { color: var(--dorado-glow) !important; }

      .td-type::before {
        content: 'Tipo: ';
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        font-size: 10px;
        text-transform: uppercase;
        color: var(--azul-medio);
        display: block;
        margin-bottom: 3px;
      }
      .td-size { text-align: left; }
      .td-size::before {
        content: 'Tamaño: ';
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        font-size: 10px;
        text-transform: uppercase;
        color: var(--azul-medio);
        display: block;
        margin-bottom: 3px;
      }

      .srdlp-table tfoot tr { display: block; }
      .srdlp-table tfoot td { display: block; border-radius: 0 0 10px 10px; }
    }
  </style>
</head>
<body id="srdlp-body">

<!-- ── Cabecera institucional Rosenthal ── -->
<div class="srdlp-header">
  <p class="srdlp-inst">CEP. Salesiano Rosenthal de la Puente</p>
  <p class="srdlp-sub">«Hagan lo que Él les diga». Creyentes, libres para servir</p>
</div>

<!-- ── Barra de título con breadcrumb navigation ── -->
<div class="srdlp-titlebar">
  <h2>📂 <?php
    if ($dir === '.') {
        echo 'Índice principal';
    } else {
        echo htmlspecialchars(basename($dir));
    }
  ?></h2>

  <?php
  /* ── Breadcrumb: descompone la ruta y enlaza cada segmento ── */
  if ($dir === '.') {
      echo '<nav class="srdlp-breadcrumb"><span class="bc-current">Índice principal</span></nav>';
  } else {
      // Limpiar el "./" inicial si existe
      $cleanDir = ltrim($dir, './');
      $cleanDir = ltrim($cleanDir, '/');
      $parts    = explode('/', $cleanDir);

      echo '<nav class="srdlp-breadcrumb">';

      // Enlace al índice raíz
      echo '<a href="?dir=.">Índice principal</a>';

      $accumulated = '.';
      $lastIndex   = count($parts) - 1;

      foreach ($parts as $i => $part) {
          if ($part === '') continue;
          $accumulated .= '/' . $part;
          echo '<span class="bc-sep">›</span>';
          if ($i === $lastIndex) {
              // Último segmento: no es enlace, es el nombre actual
              echo '<span class="bc-current">' . htmlspecialchars($part) . '</span>';
          } else {
              echo '<a href="?dir=' . htmlspecialchars($accumulated) . '">'
                   . htmlspecialchars($part) . '</a>';
          }
      }

      echo '</nav>';
  }
  ?>
</div>

<!-- ── Tabla ── -->
<div class="srdlp-wrap">
  <table class="srdlp-table">
    <thead>
      <tr>
        <th>Nombre</th>
        <th>Tipo</th>
        <th style="text-align:right">Tamaño</th>
      </tr>
    </thead>
    <tbody>

      <?php
      /* ── Fila "Regresar" ── */
      if ($dir !== '.') {
          $parentDir  = dirname($dir);
          $parentName = ($parentDir === '.') ? 'Índice principal' : basename($parentDir);
          echo "<tr>
                  <td class='td-name'>
                    <a href='?dir=" . htmlspecialchars($parentDir) . "' class='back-link'>
                      <span class='file-icon'>🔙</span> Volver a: $parentName
                    </a>
                  </td>
                  <td class='td-type'><span class='badge-type badge-back'>SUBIR</span></td>
                  <td class='td-size'>—</td>
                </tr>";
      }

      /* ── Carpetas ── */
      foreach ($folders as $folder) {
          /* Todo en mayúsculas */
          $label = htmlspecialchars(mb_strtoupper($folder, 'UTF-8'));
          echo "<tr>
                  <td class='td-name'>
                    <a href='?dir=" . htmlspecialchars("$dir/$folder") . "' class='folder-link'>
                      <span class='file-icon'>📁</span> $label
                    </a>
                  </td>
                  <td class='td-type'><span class='badge-type badge-folder'>CARPETA</span></td>
                  <td class='td-size'>—</td>
                </tr>";
      }

      /* ── Archivos ── */

      /*
       * Recorte de caracteres iniciales según carpeta:
       *   Boletín Salesiano → oculta los primeros 21 chars (muestra desde el 22)
       *   El Pan del Alma   → oculta los primeros 9 chars  (muestra desde el 10)
       *   Resto             → nombre completo
       */
      $trimMap = [
          'Boletín Salesiano' => 21,
          'El Pan del Alma'   => 9,
      ];

      $currentFolder = basename($dir);                      // caso ?dir=

      /* Si $dir es '.' probamos la ruta física real */
      if ($currentFolder === '.' || $currentFolder === '') {
          $physicalFolder = basename(__DIR__);              // carpeta del script
          if (!isset($trimMap[$physicalFolder])) {
              $physicalFolder = basename(getcwd());         // directorio de trabajo
          }
          if (isset($trimMap[$physicalFolder])) {
              $currentFolder = $physicalFolder;
          }
      }

      /* Normalizar: eliminar el prefijo './' que a veces lleva $dir */
      if ($currentFolder === '.') {
          $cleanDir = ltrim(rtrim($dir, '/'), './');
          if ($cleanDir !== '') {
              $currentFolder = basename($cleanDir);
          }
      }

      $trimOffset = isset($trimMap[$currentFolder]) ? $trimMap[$currentFolder] : 0;

      foreach ($documents as $file) {
          $filePath  = $dir . DIRECTORY_SEPARATOR . $file;
          $ext       = strtolower(pathinfo($file, PATHINFO_EXTENSION));
          $type      = strtoupper($ext);
          $size      = humanSize(filesize($filePath));
          $rawName   = pathinfo($file, PATHINFO_FILENAME);

          /* Recortar nombre según carpeta */
          if ($trimOffset > 0 && mb_strlen($rawName, 'UTF-8') > $trimOffset) {
              $displayName = mb_substr($rawName, $trimOffset, null, 'UTF-8');
          } else {
              $displayName = $rawName;
          }
          /* Reemplazar guiones bajos por espacios */
          $displayName = str_replace('_', ' ', $displayName);
          /* Todo en mayúsculas */
          $name = htmlspecialchars(mb_strtoupper($displayName, 'UTF-8'));
          $icon = getFileIcon($ext);
          $href = htmlspecialchars($filePath);

          echo "<tr>
                  <td class='td-name'>
                    <a href='$href' target='_blank'>
                      <span class='file-icon'>$icon</span> $name
                    </a>
                  </td>
                  <td class='td-type'><span class='badge-type'>$type</span></td>
                  <td class='td-size'>$size</td>
                </tr>";
      }
      ?>

    </tbody>
    <tfoot>
      <tr>
        <td colspan="3">
          <strong>Total:</strong> <?php echo $totalItems; ?> objeto<?php echo $totalItems !== 1 ? 's' : ''; ?>
          &nbsp;·&nbsp;
          <strong><?php echo count($folders); ?></strong> carpeta<?php echo count($folders) !== 1 ? 's' : ''; ?>,
          <strong><?php echo count($documents); ?></strong> archivo<?php echo count($documents) !== 1 ? 's' : ''; ?>
        </td>
      </tr>
    </tfoot>
  </table>
</div>

<!-- ══════════════════════════════════════════
     COMUNICACIÓN DE ALTURA AL IFRAME PADRE
     Ajusta height = altura real del contenido + 5%
══════════════════════════════════════════ -->
<script>
  function sendHeight() {
    var all    = document.querySelectorAll('body *');
    var bottom = 0;
    for (var i = 0; i < all.length; i++) {
      var rect = all[i].getBoundingClientRect();
      if (rect.bottom > bottom) bottom = rect.bottom;
    }
    var realHeight = Math.ceil((bottom + window.scrollY) * 1.05);
    if (window.parent && window.parent !== window) {
      window.parent.postMessage({ srdlpHeight: realHeight }, '*');
    }
  }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', sendHeight);
  } else {
    sendHeight();
  }
  window.addEventListener('load',   sendHeight);
  window.addEventListener('resize', sendHeight);
</script>

<!-- ══════════════════════════════════════════
     CÓDIGO PARA PEGAR EN LA PÁGINA WORDPRESS
     DE salesianorosenthal.edu.pe/documentos/
     (pegarlo en un bloque HTML personalizado)

<iframe
  id="srdlp-iframe"
  src="https://salesianos.online/documentos/indexrosenthal.php"
  width="100%"
  style="border:none; width:100%; display:block; min-height:200px;"
  scrolling="no"
  title="Repositorio de Documentos Salesiano Rosenthal">
</iframe>

<script>
window.addEventListener('message', function(e) {
  if (e.data && e.data.srdlpHeight) {
    var iframe = document.getElementById('srdlp-iframe');
    if (iframe) iframe.style.height = e.data.srdlpHeight + 'px';
  }
});
</script>

══════════════════════════════════════════ -->

</body>
</html>